/**
* 描述：职位管理
*/
<style lang="scss" scoped>
  @import 'src/styles/common';
  @import 'src/styles/company/index';
</style>
<style>
  .el-input--suffix .el-input__inner {
    height: 32px;
  }
  .ivu-modal-close{
    z-index: 999;
  }
</style>
<template>
  <div class="content sendJob">
    <div class="com-main-title">
      <span class="tit">职位管理</span>
      <div class="clear"></div>
    </div>
    <!--搜索条部分-->
    <div class="search-bar">
      <div class="oneImput fl wth160px">
        <el-input v-model="searchData.titleLk" placeholder="职位标题" size="small"></el-input>
      </div>
      <div class="oneImput fl wth160px" style="margin-left: 10px">
        <el-select v-model="searchData.type" style="height: 32px" clearable size="small" placeholder="职位类型">
          <el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </div>
      <div class="oneImput fl wth160px" style="margin-left: 10px">
        <el-select v-model="searchData.position" style="height: 32px" clearable filterable size="small" placeholder="职务">
          <el-option v-for="item in positionList" :key="item.id" :label="item.label" :value="item.id"></el-option>
        </el-select>
      </div>
      <div class="oneImput fr">
        <el-button type="primary" class="search-button fl" icon="search" @click="search" size="small">搜索</el-button>
        <el-button type="success" class="search-button fl" @click="clickAddOrUpdate()" size="small">新增</el-button>
        <div class="clear"></div>
      </div>
      <div class="clear"></div>
    </div>

    <!--table部分-->
    <div class="table-content">
      <el-table
        size="mini"
        :data="list"
        v-loading="loading"
        :element-loading-text="loadingText"
        highlight-current-row
        border
        style="width: 100%">
        <el-table-column
          prop="title"
          label="职位标题"
          align="center"
          width="140"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="positionName"
          align="center"
          label="职务名称"
          show-overflow-tooltip>
        </el-table-column>
        <el-table-column
          prop="status"
          align="center"
          label="职位类型"
          show-overflow-tooltip>
          <template slot-scope="scope">
            {{ scope.row.type | intentType }}
          </template>
        </el-table-column>
        <el-table-column
          prop="education"
          align="center"
          label="学历要求"
          show-overflow-tooltip>
          <template slot-scope="scope">
            {{ scope.row.education | education }}
          </template>
        </el-table-column>
        <el-table-column
          prop="experience"
          align="center"
          label="经验要求"
          show-overflow-tooltip>
          <template slot-scope="scope">
            {{ scope.row.experience | experience }}
          </template>
        </el-table-column>
        <el-table-column
          prop="demand"
          align="center"
          show-overflow-tooltip
          label="招聘数量">
          <template slot-scope="scope">
            {{ scope.row.demand | demandState }}
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          label="薪资"
          show-overflow-tooltip>
          <template slot-scope="scope">
            {{ scope.row.salary | salaryState }}
          </template>
        </el-table-column>
        <el-table-column
          prop="status"
          align="center"
          label="职位状态"
          show-overflow-tooltip>
          <template slot-scope="scope">
            {{ scope.row.status | jopStatus }}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="150px" fixed="right" class="xxx">
          <template slot-scope="scope">
            <a class="cz" @click="queryDetail(scope.row.id)">查看</a>
            <a class="cz" @click="clickAddOrUpdate(scope.row.id)">编辑</a>
            <a class="cz" v-show="scope.row.status !== 1" @click="release(scope.row.id)">发布</a>
            <a class="cz" v-show="scope.row.status === 1" @click="offline(scope.row.id)">下线</a>
            <a class="cz" v-show="scope.row.status !== 1" @click="deleteFun(scope.row.id)">删除</a>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 分页 -->
    <hy-page v-show="pageShow"
             :current-page="searchData.page"
             :page-size="searchData.limit"
             :total-element="totalElement"
             @current-change="currentChange"></hy-page>
    <Modal v-model="infoShow" :mask-closable="false" style="min-width: 720px" class="jianLiDetail-modal">
      <div class="sendJob-detail">
        <div class="inner">
          <span class="titleOne">职位名：<i>{{detailForm.title}}</i></span>
          <!--<span class="bianhao">行业编号：<i>{{detailForm.industry}}</i></span>-->
          <span class="status">状态：<i>{{detailForm.status | jopStatus}}</i></span>
          <div class="clear"></div>
          <div class="sendJob-main">
            <div class="money">￥<i>{{detailForm.salaryHigh}}</i>-<i>{{detailForm.salaryLow}}</i></div>
            <div class="clear"></div>
            <!--<div class="one"><span>公司名称：</span><i>{{detailForm.companyName}}</i></div>-->
            <div class="one"><span>职位类型及要求：</span><span class="q">{{detailForm.type | intentType}}</span><span class="q">{{detailForm.education | education}}</span><span class="q">{{detailForm.experience | experience}}</span></div>
            <div class="one"><span>招聘人数：</span><i>{{detailForm.demand}}</i></div>
            <!--<div class="one"><span>工作地址：</span>{{detailForm.address}}</div>-->
            <div class="one"><span>职位诱惑：</span><br>
            </div>
            <div class="job-content">
              <p v-for="item in detailForm.temptationList">{{item}}</p>
            </div>
            <div class="one"><span>职位描述：</span><br>
            </div>
            <div class="job-content">
              <p v-for="item in detailForm.descriptionList">{{item}}</p>
            </div>
          </div>
        </div>
      </div>
      <div slot="footer">

      </div>
    </Modal>
  </div>
</template>
<script>
  import list from '@/js/mixins/list';
  import hyHandler from '@/components/handler/handler';
  import { queryList, queryCount, publish, offline, getDetail, delFun } from '@/service/company/station/stationMService';
  import { dictJobSearch } from '@/service/company/selectService/selectMService';
  export default {
    mixins: [list],
    components: {
      hyHandler
    },
    data () {
      return {
        loading: true,
        searchData: {},
        infoShow: false,
        detailForm: {},
        typeList: [
          {value: 0, label: '全职'},
          {value: 1, label: '兼职'},
          {value: 2, label: '实习'}
        ],
        positionList: []
      };
    },
    created () {
      this.getDictJobSearchList();
    },
    methods: {
      async _getList () {
        this.loading = true;
        let result = await queryList(this.searchData);
        let temp = await queryCount(this.searchData);
        if (!result.data.length) result.data = null;
        this.list = result.data || [];
        this.totalElement = temp.data || 0;
        this.loading = false;
      },
      // 详情
      async queryDetail (id) {
        this.infoShow = true;
        let result = await getDetail({id: id});
        this.detailForm = result.data;
        this.detailForm.descriptionList = [];
        if (this.detailForm.description) {
          this.detailForm.description = this.detailForm.description.replace(/\n/g, ';');
          this.detailForm.descriptionList = this.detailForm.description.split(';');
        }
        if (this.detailForm.temptation) {
          this.detailForm.temptation = this.detailForm.temptation.replace(/\n/g, ';');
          this.detailForm.temptationList = this.detailForm.temptation.split(';');
        }
      },
      // 点击新增、修改
      clickAddOrUpdate (id) {
        this.$router.push({path: '/company/main/station/add', query: {id: id}});
      },
      // 发布
      release (id) {
        this.$confirm('确定发布？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          await publish({id: id});
          this.$Notice.success({title: '发布成功'});
          this.currentChange(1);
        }).catch(() => {
        });
      },
      // 下线
      offline (id) {
        this.$confirm('确定下线？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          await offline({id: id});
          this.$Notice.success({title: '下线成功'});
          this.currentChange(1);
        }).catch(() => {
        });
      },
      async getDictJobSearchList () {
        let result = await dictJobSearch();
        this.positionList = result.data;
      },
      // 删除
      deleteFun (id) {
        this.$confirm('确定删除？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
          await delFun({id: id});
          this.$Notice.success({title: '删除成功'});
          this.currentChange(1);
        }).catch(() => {
        });
      }
    }
  };
</script>
